/************************总容器**************************/
.wrapper{
    width: 100%;
    height: 100%;
    background-color: #F5F6FA;
}
/************************header**************************/
.wrapper .header{
    background: linear-gradient(#FFFFFF, #F5F6FA);
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
}
.wrapper .header .title{
    width: 100%;
    height: 13vw;
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.wrapper .header .title .left{
    display: flex;
    align-items: center;
}
.wrapper .header .title .left .c1{
    font-size: 5vw;
    font-weight: 550;

    margin-top: 1vw;
    margin-left: 3vw;
}
.wrapper .header .title .left .c2{
    display: flex;
    align-items: end;
    margin-top: 2vw;
}
.wrapper .header .title .left .c2 img{
    width: 3.5vw;
    height: 3.5vw;
    margin: 0 1vw 0 2vw;
}
.wrapper .header .title .left .c2 p{
    font-size: 3vw;
    color: #999999;
}
.wrapper .header .title .right .c3 {
    margin-top: 2vw;
    margin-right: 4vw;
    font-size: 3.5vw;
}
.wrapper .header .option {
    width: 100%;
    height: 12vw;

    display: flex;
    align-items: center;
}
.wrapper .header .option .c1{
    font-size: 3.5vw;
    font-weight: 550;
    padding: 1.5vw 2vw;
    border: solid 1px #FFE753;
    background-color: #FFF9DF;
    border-radius: 50px;
    margin: 0 2vw;
}
.wrapper .header .option .c2{
    font-size: 3.5vw;
    padding: 1.5vw 2vw;
    background-color: #F3F4F6;
    border-radius: 50px;
    margin: 0 2vw;
}
.wrapper .header .option .c2 .fa-star{
    color: #FF9219;
}
.wrapper .header .ad{
    width: 95%;
    height: 18vw;
    background-color: white;
    border-radius: 3vw;
    margin-bottom: 2vw;

    display: flex;
    align-items: end;
}
.wrapper .header .ad img{
    width: 14vw;
    height: 14vw;
    margin-left: 3vw;
}
.wrapper .header .ad .c1{
    margin-bottom: 3vw;
    margin-left: 1vw;
}
.wrapper .header .ad .c1 .r1{
    font-size: 4vw;
    font-weight: 550;
    margin-left: 0.2vw;
}
.wrapper .header .ad .c1 .r2{
    font-size: 3vw;
    margin-top: 1vw;
    color: #A0A0A0;
}
.wrapper .header .ad .c2{
    font-size: 4vw;
    font-weight: 550;
    color: #F10505;
    margin-bottom: 8vw;
    margin-left: 1vw;
}
.wrapper .header .ad .c3{
    font-size: 4vw;
    margin-bottom: 6vw;
    margin-left: 13vw;
    border-radius: 50px;
    padding: 1.2vw 2vw;
    border: solid 1px #C0403F;
    color: #F10505;
}
.wrapper .cart-list{
    width: 100%;
    background-color: #F5F6FA;
    padding-bottom: 13vw;

    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    align-items: center;
}
.wrapper .cart-list .business{
    background-color: white;
    width: 95%;
    border-radius: 15px;
    margin-bottom: 2vw;

    display: flex;
    flex-wrap: wrap;
    align-items: center;
}
.wrapper .cart-list .business .business-name{
    width: 100%;
    height: 10vw;
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
}
.wrapper .cart-list .business .business-name .left{
    font-size: 4vw;
    font-weight: 550;
    display: flex;
    align-items: center;
    margin-left: 5vw;
}
.wrapper .cart-list .business .business-name .left img{
    width: 4vw;
    height: 4vw;
}
.wrapper .cart-list .business .business-name .left .name{
    font-size: 4vw;
    margin-left: 2vw;
}
.wrapper .cart-list .business .business-name .right {
    display: flex;
    align-items: center;
    margin-right: 4vw;
    color: #666666;
}
.wrapper .cart-list .business .business-name .right .time{
    font-size: 3vw;
    border: solid 1px #B3B3B3;
    border-radius: 5px;
    padding: 0.5vw 1vw;
    margin-right: 1vw;
}
.wrapper .cart-list .business .goods{
    width: 100%;
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-left: 4vw;
    margin-bottom: 4vw;
}
.wrapper .cart-list .business .goods .left{
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.wrapper .cart-list .business .goods .left .o{
    width: 4vw;
    height: 4vw;
}
.wrapper .cart-list .business .goods .left .food{
    width: 24vw;
    height: 24vw;
    margin-left: 3vw;
}
.wrapper .cart-list .business .goods .left .food-name {
    margin-left: 2vw;

}
.wrapper .cart-list .business .goods .left .food-name .c1{
    font-size: 3.5vw;
    font-weight: 550;
    margin-bottom: 2vw;
}
.wrapper .cart-list .business .goods .left .food-name .c2{
    font-size: 3vw;
    margin-bottom: 2vw;
    color: #999999;
}
.wrapper .cart-list .business .goods .left .food-name .c3{
    font-size: 4vw;
    color: #FE3C00;
    font-weight: 550;
    margin-bottom: 2vw;
}
.wrapper .cart-list .business .goods .left .food-name .c3 i{
    font-size: 3vw;
}
.wrapper .cart-list .business .goods .number{
    font-size: 3vw;
    border: solid 1px #E0E0E0;
    padding: 0.5vw 1vw;
    border-radius: 3px;
    margin-right: 3vw;
    margin-top: 8vw;
}
.wrapper .cart-list .settlement{
    width: 100%;
    height: 16vw;
    background-color: white;

    display: flex;
    justify-content: space-between;
    align-items: center;

    position: fixed;
    left: 0;
    bottom: 13vw;
}
.wrapper .cart-list .settlement .left{
    font-size: 4vw;
    color: #999999;
}
.wrapper .cart-list .settlement img{
    width: 4vw;
    height: 4vw;
    margin-left: 4vw;
    margin-right: 2vw;
}
.wrapper .cart-list .settlement .right{
    display: flex;
    align-items: center;
    font-size: 4vw;
}
.wrapper .cart-list .settlement .right .c2{
    color: #FE3C00;
}
.wrapper .cart-list .settlement .right .c3{
    color: #FE3C00;
    font-size: 6vw;
    margin-bottom: 1.5vw;
    margin-left: 1vw;
}
.wrapper .cart-list .settlement .right .c4 {
    color: #FE3C00;
    font-size: 4.5vw;
}
.wrapper .cart-list .settlement .right .c5 {
    padding: 2vw 5vw;
    background-color: #FFE337;
    border-radius: 20vw;
    margin: 0 3vw;
}



/************************底部菜单**************************/
.wrapper .footer{
    width: 100%;
    height: 13vw;
    border-top: solid 1px #DDD;
    background-color: #fff;

    position: fixed;
    left: 0;
    bottom: 0;

    display: flex;
    justify-content: space-around;
    align-items: center;
}
.wrapper .footer li{
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    color: #999;
    user-select: none;
    cursor: pointer;
}
.wrapper .footer li p{
    font-size: 2.8vw;
}
.wrapper .footer .bottom2 img{
    width: 7vw;
    height: 7vw;
}











